iT邦幫忙

2023 iThome 鐵人賽

DAY 11
0
自我挑戰組

30天從零到有,帶你進入程式的世界系列 第 11

[Day 11] JavaScript 資料結構: 佇列 (Quene)

  • 分享至 

  • xImage
  •  

什麼是佇列(Queue)?

上次提到了Stack是一種先進後出的結構 (LIFO), 相對於Stack,Queue 是一個先進先出的資料結構 (FIFO: First In First out),最經典的例子就是每天會遇到的排隊,不管是通勤還是買東西,日常生活中充滿了大大小小的Queue。
https://ithelp.ithome.com.tw/upload/images/20230924/20162648wdTumZUDDN.png
日常生活中每天都會遇到各種的Queue


  • 跟Stack一樣, Queue也會有屬於自己放入跟取出的方法
  1. enqueue() 放入元素在佇列的最後
class Queue {
  constructor() {
    this.items = [];
  }
  enqueue(element) {
    if (element) {
      this.items.push(element);
    }
  }
}
  1. dequeue() 從佇列的最前端取出元素
class Queue {
  constructor() {
    this.items = [];
  }
  enqueue(element) {
    if (element) {
      this.items.push(element);
    }
  }
  dequeue() {
    return this.items.shift();
  }
}
  1. Queue也一樣有peek()方法, 不過在這邊是回傳陣列的第一個元素而不是最後一個
class Queue {
  constructor() {
    this.items = [];
  }
  enqueue(element) {
    if (element) {
      this.items.push(element);
    }
  }
  dequeue() {
    return this.items.shift();
  }

  peek() {
    return this.items[0];
  }
}

資料結構 (Stack vs Queue)

最後重新比較一次

Stack (堆疊)

  • first in, last out : 先進去的會晚出來

https://ithelp.ithome.com.tw/upload/images/20230924/20162648Hzrx9QZmwi.png

Quene (佇列)

  • first in, first out : 先進去的先出來

https://ithelp.ithome.com.tw/upload/images/20230924/20162648ksTJJNoe0i.png

參考來源: https://www.educba.com/queue-in-javascript/


上一篇
[Day 10] Javascript 資料結構: 堆疊 (Stack)
下一篇
[Day 12] 變數提升(Variable Hoisting)
系列文
30天從零到有,帶你進入程式的世界30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言